<template>
	<div>
		
		
		<div class="shangchuan">
	
			<div @click="takePhoto" >
					<image v-show="isshowHeader==false"  src="../../../static/qiao-img/photo.png" @error="imageError" class="image"></image>
						<image v-show="isshowHeader==true"  :src="imageUrl" @error="imageError" class="image"></image>
					<div class="add">
							<span>添加图/视频</span>
					</div>
			</div>
		</div>
		<div>
				<textarea @blur="bindTextAreaBlur" placeholder-style="color:#fff00" placeholder="展开说说你对该商品的想法吧" />
		</div>
		<div>
			<button   class="submitPl" @click="SubmitPl">提交评论</button>
		</div>
		
		
	</div>
</template>
<script setup>
	import {ref} from 'vue'
	let imageUrl=ref("")
	let isshowHeader=ref(false)
	const  imageError=function(e) {
            console.error('image发生error事件，携带值为' + e.detail.errMsg)
        }
		const bindTextAreaBlur=function (e) {
            console.log(e.detail.value)
        }
	const takePhoto = async () => {
		
	  try {
	    const res = await uni.chooseImage({
	      count: 1, // 限制选择一张图片
	      sizeType: ['original', 'compressed'], // 可以选择原图或压缩图
	      sourceType: ['album', 'camera'], // 从相册或相机选择
	    });
	    if (res.errMsg === "chooseImage:ok") {
	      const tempFilePath = res.tempFilePaths[0];
		  imageUrl.value=tempFilePath
		  isshowHeader.value=true
		  console.log(imageUrl.value,'imageUrl.value----')
	    } else {
	      console.error('选择图片失败', res.errMsg);
	    }
	  } catch (error) {
	    console.error('调用chooseImage异常', error);
	  }
	};
	const SubmitPl=()=>{
		// console.log('提交评论')
		uni.showToast({
			title:"提交评论成功"
		})
		uni.switchTab({
			url:'/pages/Order/Order'
		})
	}
	
</script>
<style scope>
	image{

		width:50px;
		height: 50px;
	}
	textarea{
			border:1px solid black;
			width: 100%;
			height: 300px;
			
	}
	.shangchuan{
			/* border:1px solid black; */
			height: 200px;
			display:flex;
			justify-content:center;
			align-items:center;
		
			
	}
	.add{
					/* border:1px solid black; */
					margin-left:-20px;
	}
	.submitPl{


		border-radius: 40px;
		background-color: rgba(255,164,0,1);
		color: rgba(255,255,255,1);
		text-align: center;
		font-family: Roboto;
		margin-top:20px;
		width: 200px;
		font-size:12px;
		height: 40px;
		line-height:40px;		
	}
</style>
